<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>新增成功案例</title>


    <!-- Expand styles -->
    <link href="../css/app/app.css" rel="stylesheet">
    <link href="../css/app/default.css" rel="stylesheet">
    <link href="../css/mui/mui.css" rel="stylesheet">
    <link href="../css/mui/mui.picker.min.css" rel="stylesheet" />




    <!-- Custom styles for this template -->
    <!-- <link href="../css/iOS/mobile/mobile.css" rel="stylesheet"> -->
</head>

<body>
    <!-- header -->
    <div class="margin-b-60">
        <div class="list-group patient-list1 margin-b-i10">
            <div class="list-cell text-cell list-cell1" onclick="showPicker()">
                <div class="web-box1 list-left">培训类型<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right">
                    <div class="display-flex align-items-center justify-content-center">
                        <input type="text" placeholder="请选择" id="serviceType" disabled>
                        <!-- <span>请选择标签</span> -->
                        <img class="sele-icon" src="../img/next.png" />
                    </div>
                </div>
            </div>

            <div class="list-cell text-cell list-cell1" onclick="showAddress()">
                <div class="web-box1 list-left">培训地点<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right">
                    <div class="display-flex align-items-center justify-content-center">
                        <input type="text" placeholder="请选择" id="address" disabled>
                        <!-- <span>请选择标签</span> -->
                        <img class="sele-icon" src="../img/next.png" />
                    </div>
                </div>
            </div>

            <div class="list-cell text-cell list-cell1" onclick="startTime()">
                <div class="web-box1 list-left">培训开始时间<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right" id="btn3">
                    <div class="display-flex align-items-center justify-content-center">
                        <input type="text" placeholder="请选择" id="startTime" disabled>
                        <!-- <span>请选择标签</span> -->
                        <img class="sele-icon" src="../img/next.png" />
                    </div>
                </div>
            </div>
            <div class="list-cell text-cell list-cell1" onclick="endTime()">
                <div class="web-box1 list-left">培训截止时间<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right" id="btn4">
                    <div class="display-flex align-items-center justify-content-center">
                        <input type="text" placeholder="请选择" id="endTime" disabled>
                        <!-- <span>请选择标签</span> -->
                        <img class="sele-icon" src="../img/next.png" />
                    </div>
                </div>
            </div>
        </div>
        <div class="list-group patient-list1 margin-b-i10">
            <div class="list-cell text-cell list-cell1">
                <div class="web-box1 list-left">培训主题<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入培训主题" id="title">
                </div>
            </div>

            <div class="list-cell text-cell">
                <div class="web-box1 list-left">培训人数<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right display-flex">
                    <input type="number" placeholder="请输入培训人数" id="tranPeopleNum">
                    <span class="padding-l-5 font-15 black">人</span>
                </div>
            </div>

            <div class="list-cell text-cell list-cell1">
                <div class="web-box1 list-left">培训主办方<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入培训主办方"
                        id="tranSponsors">
                </div>
            </div>

            <div class="list-cell text-cell list-cell1">
                <div class="web-box1 list-left">培训老师<span class="red">*</span></div>
                <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入培训老师" id="teacher">
                </div>
            </div>
            <div class="list-cell text-cell list-cell1">
                <div class="web-box1 list-left">详细地址</div>
                <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入详细地址"
                        id="tranAddress">
                </div>
            </div>
        </div>
        <div class="widget-default widget-body">
            <div class="web-box1 list-left padding-b-10 font-15 black">培训图片<span class="red">*</span></div>
            <div class="list-right">
                <ul id="imgUL">
                    <img src="../img/add-img.png" class="tuiUp" name="" id="img1" index="1">
                    <img src="../img/add-img.png" class="tuiUp" name="" id="img2" index="2" style="display: none;">
                    <img src="../img/add-img.png" class="tuiUp" name="" id="img3" index="3" style="display: none;">
                    <img src="../img/add-img.png" class="tuiUp" name="" id="img4" index="4" style="display: none;">
                    <img src="../img/add-img.png" class="tuiUp" name="" id="img5" index="5" style="display: none;">
                </ul>
                <p class="topwz sershopLeft serDrop">上传图片（最多五张）</p>
            </div>

        </div>



    </div>
    <div class="save-btn hobby-footer1">
        <button type="button" class="mui-btn mui-btn-primary mui-btn-block bc-head" onclick="submit()">提交</button>
    </div>


    <script src="../js/dsbridge.js"></script>
    <script src="../js/jquery.js"></script>
    <script src="../js/mui/mui.js"></script>
    <script src="../js/mui/mui.picker.min.js"></script>
    <script src="../js/layer.js"></script>
    <script src="../js/app/app-base.js"></script>
    <script src="../js/app/app-url.js"></script>
    <script src="../js/app/app-ajax.js"></script>
    <script src="../js/city-data.js"></script>

    <script>
        var id = localStorage.getItem("case-edit-id");
        var pickerServerType = new mui.PopPicker();
        var pickerAddress = new mui.PopPicker({
            layer: 3
        });

        // 时间选择
        var myDate = new Date();
        //获取当前年
        var year = myDate.getFullYear();
        //获取当前月
        var month = myDate.getMonth();
        //获取当前日
        var day = myDate.getDate();

        //规定年月日的选择
        var dtpicker = new mui.DtPicker({
            type: "datetime", //设置日历初始视图模式    //真正的月份比写的多一个月。  type的类型你还是可以选择date, datetime month time  hour 
            beginDate: new Date(year, month, day), //设置开始日期   
            endDate: new Date(year + 50, month, day) //设置结束日期    

        })

        var serviceTypeCode = "";

        var provinceCode = "";
        var cityCode = "";
        var countyCode = "";


        $(document).ready(function () {


            var data = {
                pCode: 'TRAN_TYPE'
            }
            //培训类型
            getServerData(url_businessdatamng_queryList, data, "GET");
            pickerAddress.setData(cityData);

            //展示图片
            dsBridge.register('showImg', function (i, imgId, fileName, fileSize) {
                $("#img" + i).attr("src", showSmallImg(imgId));
                if (i < 5)
                    $("#img" + (Number(i) + 1)).show();
                $("#img" + i).attr("name", fileName);
                $("#img" + i).attr("pid", imgId);
                $("#img" + i).attr("size", fileSize);

            })

            var img = localStorage.getItem("re-xm-img");
            if (!isEmpty(img))
                $("#img").attr("src", img);

            $("#name").html(localStorage.getItem("re-xm-name"));

            if (id != undefined && id != '') {
                var data = {
                    id: id
                }
                //培训类型
                getServerData(url_queryOffLineDetail, data, "GET");
            }



        });


        //培训类型
        function showPicker() {
            pickerServerType.show(function (item) {
                $("#serviceType").val(item[0].text);
                serviceTypeCode = item[0].id;
            });
        }

        //开始时间
        function startTime() {
            dtpicker.show(function (e) {
                $("#startTime").val(e.text);
            });
        }

        //结束时间
        function endTime() {
            dtpicker.show(function (e) {
                $("#endTime").val(e.text);
            });
        }

        //选择地址
        function showAddress() {
            pickerAddress.show(function (item) {
                provinceCode = item[0].value;
                cityCode = item[1].value;;
                countyCode = item[2].value;;
                var address = item[0].text + emptyShow(item[1].text) + emptyShow(item[2].text);
                $("#address").val(address);
            });
        }

        // 接口调用返回
        function getServerDataSuccess(url, body, tag) {
            switch (url) {
                case url_businessdatamng_queryList: //培训类型
                    var data = body.data;
                    var arr = new Array();
                    for (var i = 0; i < data.length; i++) {
                        var vo = {
                            text: data[i].name,
                            id: data[i].code
                        }
                        arr.push(vo);
                    }
                    pickerServerType.setData(arr);
                    break;

                case url_saveOffLine:

                    dsBridge.call("save");
                    showAlertClose("提交成功");
                    break;
                case url_queryOffLineDetail:
                    var data = body.data;
                    serviceTypeCode = data.tranType.code;
                    $("#serviceType").val(data.tranType.name);
                    provinceCode = data.province.provinceCode;
                    if (data.city != null)
                        cityCode = data.city.cityCode;
                    if (data.county != null)
                        countyCode = data.county.countyCode;

                    var address = data.province.provinceName;
                    if (!isEmpty(data.city))
                        address += data.city.cityName;
                    if (!isEmpty(data.county))
                        address += data.county.countyName;
                    if (!isEmpty(data.tranAddress))
                        address += data.tranAddress;
                    $("#address").val(address);
                    $("#startTime").val(data.tranBeginTime);
                    $("#endTime").val(data.tranEndTime);
                    $("#title").val(data.title);
                    $("#tranPeopleNum").val(data.tranPeopleNum);
                    $("#tranSponsors").val(data.tranSponsors);
                    $("#teacher").val(data.teacher);
                    $("#tranAddress").val(data.tranAddress);
                    var i = 1;
                    $.each(data.fileInfos, function (index, item) {
                        $("#img" + i).attr("src", showSmallImg(item.fileId));
                        $("#img" + (Number(i) + 1)).show();
                        $("#img" + i).attr("name", item.name);
                        $("#img" + i).attr("pid", item.fileId);
                        $("#img" + i).attr("size", item.size);

                        i++;
                    })




                    break;

            }
        }




        function submit() {

            var temp = new Array();

            $("#imgUL img").each(function () {
                if (!isEmpty($(this).attr("name"))) {
                    var vo = {
                        fileId: $(this).attr("pid"),
                        name: $(this).attr("name"),
                        regex: "jpg",
                        size: $(this).attr("size")
                    }
                    temp.push(vo);
                }
            })


            if (isEmpty(serviceTypeCode)) {
                showToast("请选择培训类型");
                return;
            }

            if (isEmpty(provinceCode)) {
                showToast("请选择地址");
                return;
            }


            var startTime = $("#startTime").val();
            if (isEmpty(startTime)) {
                showToast("请选择开始时间");
                return;
            }

            var endTime = $("#endTime").val();
            if (isEmpty(endTime)) {
                showToast("请选择结束时间");
                return;
            }

            var title = $("#title").val();
            if (isEmpty(title)) {
                showToast("请输入培训主题");
                return;
            }

            var tranPeopleNum = $("#tranPeopleNum").val();
            if (isEmpty(tranPeopleNum)) {
                showToast("请输入培训人数");
                return;
            }

            var tranSponsors = $("#tranSponsors").val();
            if (isEmpty(tranSponsors)) {
                showToast("请输入主办方");
                return;
            }

            var teacher = $("#teacher").val();
            if (isEmpty(teacher)) {
                showToast("请输入培训老师");
                return;
            }

            if (temp.length == 0) {
                showToast("请上传图片");
                return;
            }

            loading();

            var data = {
                id: id,
                userAccId: getUserId(),
                tranTypeCode: serviceTypeCode,
                title: title,
                tranSponsors: tranSponsors,
                tranBeginTime: startTime,
                tranEndTime: endTime,
                provinceCode: provinceCode,
                cityCode: cityCode,
                countyCode: countyCode,
                tranAddress: $("#tranAddress").val(),
                tranPeopleNum: tranPeopleNum,
                teacher: teacher,
                fileInfos: temp
            }
            console.log(data);
            getServerData(url_saveOffLine, data, "POST");

        }


        //图片上传部分 tuiUp

        mui("#imgUL").on('tap', '.tuiUp', function () {

            var that = $(this);
            var name = $(this).attr("name");
            var i = $(this).attr("index");
            if (name == "") {
                dsBridge.call("selectImage", i);
            } else {
                layer.open({
                    content: '是否删除该图片？',
                    btn: ['确认', '取消'],
                    yes: function (index) {
                        that.attr("src", "../img/add-img.png");
                        that.attr("name", "");
                        that.attr("pid", "");
                        layer.close(index);
                    }
                });
            }
        });
    </script>




</body>

</html>